<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui">

<h:head>
	<style type="text/css">
.alignPanel>tbody>tr {
	vertical-align: top;
}
</style>
</h:head>
<body>
	<ui:composition template="../templates/mainTemplate.xhtml">
		<ui:define name="content">
			<h:form id="myForm">
				<p:panel header="#{messages['categoryDefination.define']}">
					<h:panelGrid columns="2" styleClass="alignPanel">
						<p:panel header="#{messages['categoryDefination.categoryTree']}" id="treePanel">
							<p:tree value="#{cCategoryForm.rootNode}" var="node" selectionMode="single" dynamic="true" animate="true"
								selection="#{cCategoryForm.selectedNode}">

								<p:ajax event="select" update=":myForm" listener="#{cCategoryAction.changeSelection()}" />
								<p:treeNode>
									<h:outputText value="#{node.name}" />
								</p:treeNode>
							</p:tree>
						</p:panel>
						<p:panel header="#{cCategoryForm.selectedCategory.name}" rendered="#{cCategoryForm.selectedCategory ne null}"
							id="addPanel">
							<h:panelGrid columns="1">
								<p:commandLink value="#{messages['categoryDefination.addSubCategory']}"
									actionListener="#{cCategoryAction.myNewCategory}" update=":myForm" oncomplete="dlg1.show();" />
								<p:commandLink value="#{messages['categoryDefination.deleteCategory']}" oncomplete="deleteWidget.show();"
									rendered="#{cCategoryForm.selectedCategory.parentCategory.parentCategory ne null}" />
								<p:commandLink value="#{messages['categoryDefination.updateCategory']}"
									action="#{cCategoryAction.updateCategory}" update=":myForm" oncomplete="dlg2.show();"
									rendered="#{cCategoryForm.selectedCategory.parentCategory.parentCategory ne null}" />
								<p:commandLink value="#{messages['categoryDefination.addVariable']}" action="#{cCategoryAction.defineVariable}" />
							</h:panelGrid>
						</p:panel>
					</h:panelGrid>

					<p:confirmDialog id="deletePanel" header="#{messages['categoryDefination.deleteCategory']}"
						message="#{messages['categoryDefination.eminmisiniz']}" severity="alert" widgetVar="deleteWidget" closable="true">

						<p:commandButton id="confirm" value="#{messages['action.okay']}" update=":myForm" oncomplete="deleteWidget.hide()"
							actionListener="#{cCategoryAction.delete}" />

						<p:commandButton id="decline" value="#{messages['action.cancel']}" onclick="deleteWidget.hide()" type="button" />
					</p:confirmDialog>


					<p:dialog id="categoryAdding" widgetVar="dlg1" rendered="#{cCategoryForm.newCategory ne null}"
						header="#{messages['categoryDefination.addNewCategory']}" showEffect="bounce" hideEffect="explode"
						resizable="false">
						<h:panelGrid columns="2">
							<h:outputText value="#{messages['categoryDefination.name']} : " />
							<p:inputText value="#{cCategoryForm.newCategory.name}" />

							<h:outputText value="#{messages['categoryDefination.description']} : " />
							<p:inputText value="#{cCategoryForm.newCategory.description}" />

							<h:outputText value="#{messages['categoryDefination.parent']} : " />
							<h:outputText value="#{cCategoryForm.newCategory.parentCategory.name}" />

							<p:commandButton value="#{messages['action.save']}" action="#{cCategoryAction.addNewCategory}"
								update=":myForm:treePanel" oncomplete="dlg1.hide();" />
							<p:commandButton value="#{messages['action.cancel']}" onclick="dlg1.hide();" />
						</h:panelGrid>
					</p:dialog>

					<p:dialog id="categoryUpdating" widgetVar="dlg2" rendered="#{cCategoryForm.editPanel}"
						header="#{messages['categoryDefination.editCategory']}" showEffect="bounce" hideEffect="explode" resizable="false">
						<h:panelGrid columns="2">
							<h:outputText value="#{messages['categoryDefination.name']} : " />
							<p:inputText value="#{cCategoryForm.selectedCategory.name}" />

							<h:outputText value="#{messages['categoryDefination.description']} : " />
							<p:inputText value="#{cCategoryForm.selectedCategory.description}" />

							<h:outputText value="#{messages['categoryDefination.parent']} : " />
							<p:selectOneMenu value="#{cCategoryForm.selectedCategoryId}">
								<f:selectItems value="#{cCategoryForm.selectItemList}" />
							</p:selectOneMenu>

							<p:commandButton value="#{messages['action.save']}" onclick="dlg2.hide();"
								action="#{cCategoryAction.editCategory}" update=":myForm" />
							<p:commandButton value="#{messages['action.cancel']}" onclick="dlg2.hide();" />
						</h:panelGrid>
					</p:dialog>
				</p:panel>
			</h:form>
		</ui:define>
	</ui:composition>
</body>
</html>